<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://xmlns.jcp.org/jsf/html"
      xmlns:f="http://xmlns.jcp.org/jsf/core"
      xmlns:p="http://primefaces.org/ui">
    <f:metadata>
        <f:viewParam name="idEv" value="#{eventBean.eventViewedId}"/>
        <f:viewAction action="#{eventBean.loadEvent}"/>
    </f:metadata>
    <h:head>
        <title>Event #{eventBean.eventViewed.title}</title>
        <style>@import url("../resources/css/homepageCSS1.css")</style>
    </h:head>
    <h:body>
        <p:layout fullPage="true">
            <p:layoutUnit styleClass="topLayout" position="north" size="100" resizable="true">
                <img id="titleImg" src="../resources/images/titolo90.png" alt="METEOCAL"/>
                <div id="userBlock">
                    <h:form>
                        <p:outputLabel>
                            #{userBean.name}&nbsp;&nbsp;&nbsp;<b>|</b>&nbsp;&nbsp;&nbsp;
                        </p:outputLabel>
                        <p:link style="color: blue;" value="Home" outcome="home?faces-redirect=true"/>
                        <p:outputLabel>
                            &nbsp;&nbsp;&nbsp;<b>|</b>&nbsp;&nbsp;&nbsp;
                        </p:outputLabel>
                        <p:commandLink style="color: blue;" action="#{loginBean.logout()}" value="Logout"/>
                    </h:form>
                </div>
            </p:layoutUnit>
            <p:layoutUnit position="center" styleClass="centralBlock">
                <div align="center">
                    <h:form rendered="#{eventBean.eventViewed.deleted}">
                        <div>This event has been deleted.</div>
                    </h:form>

                    <h:form rendered="#{!eventBean.eventViewed.deleted}">
                        <h:form rendered="#{eventBean.checkPrivate()}">
                            <div>This event is private.</div>
                        </h:form>
                        <p:panel styleClass="panelFormOpacity" style="width: 80%;" rendered="#{!eventBean.checkPrivate()}">
                            <h:form>
                                <table align="center" width="99%" style="font-family: verdana, sans-serif;" rules="rows" cellpadding="15px">
                                    <caption>
                                        <div id="evTableTitle">
                                            #{eventBean.eventViewed.title}
                                        </div>
                                    </caption>

                                    <tbody>
                                        <tr>
                                            <td width="10%">
                                                Description:
                                            </td>
                                            <td width="35%">
                                                #{eventBean.eventViewed.description}
                                            </td>
                                            <td width="55%" align="center" rowspan="5" valign="top">
                                                <p:panel style="width : 95%; border: 0px solid;">
                                                <p:dataList paginatorAlwaysVisible="false" paginatorPosition="bottom" value="#{eventBean.participantList}" var="participant" type="unordered" itemType="none" paginator="true" rows="4" styleClass="paginated">
                                                    <f:facet name="header">
                                                        Participants
                                                    </f:facet>

                                                    <table width="90%" rules="cols">
                                                        <tr>
                                                            <td width="75%">#{participant.user1.firstName} #{participant.user1.lastName} (<h:link value="#{participant.user1.email}" outcome="#{userDataBean.redirectToUserPage(participant.user1.email)}"/>)</td>
                                                            <td width="25%" align="right">#{participant.answer}</td>
                                                        </tr>
                                                    </table>
                                                </p:dataList>
                                                </p:panel>
                                           
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Country:</td>
                                            <td>#{eventBean.eventViewed.country}</td>
                                        </tr>
                                        <tr>
                                            <td>City:</td>
                                            <td>#{eventBean.eventViewed.city}</td>
                                        </tr>
                                        <tr>
                                            <td>Address:</td>
                                            <td>#{eventBean.eventViewed.address}</td>
                                        </tr>
                                        <tr>
                                            <td>Location:</td>
                                            <td>#{eventBean.eventViewed.location}</td>
                                        </tr>
                                        <tr>
                                            <td>Privacy:</td>
                                            <td>#{eventBean.eventViewed.visibiltiy}</td>
                                            <td width="30%" rowspan="5" valign="center" align="center">
                                                <p:panel rendered="#{eventBean.eventViewed.forecast!=null}" style="width: 90%" styleClass="panelFormNoBorder" header="Forecast for #{eventBean.eventViewed.city}">
                                                    <table align="center" width="95%" rules="rows">
                                                        <tbody>
                                                            <tr>
                                                                <td width="30%" rowspan="4" align="center">
                                                                    <img width="120px" src="#{eventBean.image}" alt="Unavailable image"></img>
                                                                </td>
                                                                <td align="center" colspan="2" style="font-size: 1.3em;">#{eventBean.eventViewed.forecast.weatherDescription}</td>
                                                            </tr>
                                                            <tr>
                                                                <td width="30%" align="center">Min</td>
                                                                <td width="40%" align="center"><h:outputLabel rendered="#{eventBean.eventViewed.forecast.weatherCode!=666666}" value="#{eventBean.eventViewed.forecast.minTemp}°C"/></td>                                                            </tr>
                                                            <tr>
                                                                <td align="center">Max</td>
                                                                <td align="center"><h:outputLabel rendered="#{eventBean.eventViewed.forecast.weatherCode!=666666}" value="#{eventBean.eventViewed.forecast.maxTemp}°C"/></td>
                                                            </tr>
                                                            <tr style="font-size: 0.8em;">
                                                                <td width="40%" align="center">Last update</td>
                                                                <td width="60%" align="center">                                
                                                                    <h:outputLabel id="to" value="#{eventBean.eventViewed.forecast.lastUpdate}">
                                                                        <f:convertDateTime pattern="MM/dd/yyyy &nbsp;-&nbsp; HH:mm" timeZone="#{eventBean.timeZone}"/>
                                                                    </h:outputLabel>
                                                                </td>
                                                            </tr> 
                                                        </tbody>
                                                    </table>
                                                </p:panel>
                                            </td>
                                        </tr>
                                        <tr>
                                            <td>Starting at:</td>
                                            <td><h:outputLabel value="#{eventBean.eventViewed.startDate}"><f:convertDateTime pattern="MM/dd/yyyy &nbsp;-&nbsp; HH:mm" timeZone="#{eventBean.timeZone}"/></h:outputLabel></td>
                                        </tr>
                                        <tr>
                                            <td>Ending at:</td>
                                            <td><h:outputLabel value="#{eventBean.eventViewed.endDate}"><f:convertDateTime pattern="MM/dd/yyyy &nbsp;-&nbsp; HH:mm" timeZone="#{eventBean.timeZone}"/></h:outputLabel></td>
                                        </tr>
                                        <tr>
                                            <td><b>Creator:</b></td>
                                            <td><b>#{eventBean.eventViewed.creator}</b></td>
                                        </tr>
                                    </tbody>
                                </table>
                                <br/>
                                <h:form rendered="#{eventBean.checkFormRender()}">
                                    <p:commandButton id="delete" value="Delete" rendered="#{eventBean.checkCreator()}" action="#{eventBean.delete()}" />
                                    <p:commandButton id="modify" value="Modify" rendered="#{eventBean.checkCreator()}" action="modifyEvent?faces-redirect=true"/>
                                    <p:commandButton id="answer_yes" value="Join" rendered="#{eventBean.checkParticipant()}" disabled="#{eventBean.checkJoining()}" action="#{eventBean.join()}"/>
                                    <p:commandButton id="answer_no"  value="Decline" rendered="#{eventBean.checkParticipant()}" disabled="#{eventBean.checkDeclining()}" action="#{eventBean.decline()}"/>
                                </h:form>
                            </h:form>
                        </p:panel>
                    </h:form>
                </div>
            </p:layoutUnit>
        </p:layout>
    </h:body>
</html>

